<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>

<s:set name="stat" value="actstatus"/>
<s:if test="%{#stat!=undefined}">
    <s:if test="%{#stat!='ok'}">
        <dl class="ui-state-error ui-corner-all">
            <dt><span class="ui-icon ui-icon-alert"></span><s:property value="#stat"/></dt>
        </dl>
    </s:if>
    <s:elseif test="%{#stat=='ok'}">
        <dl class="ui-state-highlight ui-corner-all" style="clear:both">
            <dt><span class="ui-icon ui-icon-info"></span>Collection saved!</dt>
        </dl>
    </s:elseif>
</s:if>
<s:if test="%{#privilegeEdit.allowable == false}">
    <dl class="ui-state-highlight ui-corner-all" style="clear:both">
        <dt><span class="ui-icon ui-icon-info"></span>You are not allowed to edit in this module.</dt>
    </dl>
    <script type="text/javascript">
        $(document).ready(function(){
            $('#btmbutton').css("margin-top","0em");
            $('#savebtn').attr("disabled","disabled");
            $('#postcollbtn').attr("disabled","disabled");
        });
    </script>
</s:if>
<s:if test="%{#request.collection.stat== 'posted'}">
    <dl class="ui-state-highlight ui-corner-all" style="clear:both">
        <dt><span class="ui-icon ui-icon-info"></span>The collection has already been posted.</dt>
    </dl>
    <script type="text/javascript">
        $(document).ready(function(){
            //$('#btmbutton').css("margin-top","26em");
            $('#savebtn').attr("disabled","disabled");
            $('#postcollbtn').attr("disabled","disabled");
        });
    </script>
</s:if>

<jsp:include page="../../WEB-INF/fragments/searchcollection.jsp"/>
 
<s:div id="" style="float: left; width: 665px;font-size:12px;margin-left:2em;" >
    <s:form action="post-coll" id="postcollform" cssStyle="font-size:12px;width:800px;clear:both" theme="simple" name="bottom">
        <s:div id="collinfo" style="float: left; width: 800px;font-size:12px;margin-left:2em;">
            <table>
                <tr>
                    <td><s:label>Branch Code</s:label></td>
                    <td><s:textfield label="Branch Code" type="text" id="b" cssClass="branchid" readonly="true"/></td>
                    <td>&nbsp;</td>
                    <td><s:label>Sequence</s:label></td>
                    <td><s:textfield id="sequence" name="sequence" label="Sequence" value="%{#request.collection.collectionid}" readonly="true"/></td>

                </tr>
                <tr>
                    <td><s:label>Document</s:label></td>
                    <td><s:textfield id="document" name="document" label="Document" value="%{#request['document'].documenttype}" readonly="true"/></td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                </tr>
                <tr>
                    <td><s:label>Document Date</s:label></td>
                    <td><s:textfield id="datecoll" label="Date" name="datecoll" value="%{#request.document.documentdate}"/></td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                </tr>
                <tr><td><s:label>Area Code</s:label></td>
                    <td><s:textfield id="acodecoll" name="acodecoll" value="%{#request.collection.areacode}"/></td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                </tr>
                <tr>
                    <td><s:label>Account Representative Code</s:label></td>
                    <td><s:textfield id="ccodecoll" name="ccodecoll" cssClass="ccode" label="AR Code" value="%{#request.collection.employees.idnumber}"/></td>
                    <td><p id="errorcoll" style="display: none;color:red">Error</p></td>
                    <td><s:label>Account Representative Name</s:label></td>
                    <td><s:textfield id="cnamecoll" name="cnamecoll" label="AR Name" value="%{#request.collection.employees.completename}"/></td>
                </tr>
            </table>
            <br/>

        </s:div>
        <s:div id="bottomcoll" cssStyle="height:200px;width:960px;overflow:auto">

            <div>
                <!--dito nakalagay yung save-payment-->
                <table border="1px" cellspacing="0" id="payment" style="width:840px;font-size: 14px;margin-left:0px" >
                    <thead>
                        <tr>
                            <th style="width:80px">Series</th>
                            <th style="width:140px">Borrower Code</th>
                            <th style="width:180px">Borrower Name</th>
                            <th style="width:150px">Official Receipt No.</th>
                            <th style="width:120px">Amount</th>
                            <th style="width:80px">Payment</th>
                        </tr>
                    </thead>
                    <tbody>
                        <s:iterator value="#request.paylist">
                            <tr>
                                <td><input class="seriesreq" id="seriesreq" name="seriesname" value="<s:property value="seriesno"/>"/></td>
                                <td><input id="borrowercodereq" name="bcodename" value="<s:property value="loans.borrowers.borrowerid"/>"/></td>
                                <td><input id ="borrowernamereq" name="bnamename" value="<s:property value="loans.borrowers.completename"/>"/></td>
                                <td><input id ="ornumreq" style="text-align: right" name="receiptname" value="<s:property value="receiptno"/>"/></td>
                                <td><input id ="amountreq" style="text-align: right" name="amountname" value="<s:property value="amount"/>"/></td>
                                <td><input id="paymenttypereq" name="paymenttype" value="<s:property value="type"/>"/></td>
                        <input style="display:none" value="<s:property value="seriesno"/>" id="lastseries"/>
                        </tr>
                    </s:iterator>
                    </tbody>
                    <tbody id="tbodysum2">
                    </tbody>
                    <s:if test="%{#request.collection.stat!= 'posted'}">
                        <tbody>
                            <tr id="trInput">
                        <script type="text/javascript">
                            $(window).load(function(){
                                $('#series').val(parseInt($('.seriesreq:last').val())+parseInt(1));
                            });
                        </script>
                        <td><s:textfield id="series" disabled="false" name="series" cssStyle="display:inline" readonly="true"/></td>
                        <td><s:textfield type="text" cssClass="borrower" id="borrowercode" name="borrowercode" cssStyle="display:inline"/></td>
                        <td><sj:autocompleter list="%{#request.borrowers}"
                                          listValue="completename" id ="borrowername" name="borrowername" cssStyle="display:inline" /></td>
                        <td><s:textfield id ="ornum" name="ornum" cssStyle="display:inline"/></td>
                        <td><s:textfield id ="amount" name="amount" cssStyle="display:inline"/></td>
                        <td><s:select
                                id="paymenttype"
                                name="paymenttype"
                                list="{'cash','check'}"
                                emptyOption="false"
                                cssClass="nextbtn"
                                />
                        </td>
                        </tr>
                        </tbody>
                    </s:if>
                </table>
                <p id="errorinfo" style="display:none;float:left;color:white;background-color: red;font-style: italic;padding: 5px;font-size: 12px;"></p>

            </div>

            <table style="clear:both">
                <tr>
                    <td><s:label>Total Collection</s:label></td>
                    <td><s:textfield type="text" id="totalc" name="totalc" label="Total Collection" value="%{#request['collection'].totalamountcollected}" cssClass="money" readonly="true"/></td>
                </tr>
                <tr id="sectr">
                    <td><s:label>Cash Deposited</s:label></td>
                    <td><s:textfield id="cashdeposit" class="money" name="cashdeposit" label="Cash Deposited" value="%{#request['collection'].depositamount}"/></td>
                    <td><s:label>Deposit No.</s:label></td>
                    <td><s:textfield id="cshdepositnum" name="cshdepositnum" label="Deposit No." value="%{#request['collection'].depositno}"/></td>
                    <td><s:label>Bank Account No.</s:label></td>
                    <td><s:textfield id="bankacctnum" name="bankacctnum" label="Bank Account No." value="%{#session['branch'].bankaccountnum}" readonly="true"/></td>
                </tr>
                <tr id="totaltr">
                    <td><s:label>Undeposited Cash</s:label></td>
                    <td><s:textfield id="cashonhand" cssClass="money" name="cashonhand" label="Undeposited Cash" value="%{#request['collection'].cashonhand}"/></td>
                </tr>
                <tr>
                    <td><s:label>Cash Short or Over</s:label></td>
                    <td><s:textfield type="text" id="cashshort" cssClass="money" name="cashshort" label="Cash Short or Over" value="%{#request['collection'].short_}"/></td>
                </tr>
            </table>

            <%--   <sj:submit/>--%>

            <br/>
            <hr/>
            <%-- <s:div cssStyle="clear:both;float:left;margin-bottom:1em;display:none" id="">
                 <table border="1px" cellspacing="0">
                     <thead>
                         <tr>
                             <th>Series</th>
                             <th style="width:100px">Borrower Code</th>
                             <th>Borrower Name</th>
                             <th style="width:120px">Official Receipt No.</th>
                             <th style="width:120px">Amount</th>
                             <th style="width:80px">Payment</th>
                         </tr>
                     </thead>
                     <tbody>

                    </tbody>
                    <tbody id="">

                    </tbody>
                </table>
            </s:div>--%>
            <br/>
            <s:if test="%{#request.collection.stat!= 'posted'}">
                <table>
                    <tr>
                        <th>Denomination</th>
                        <th>Pcs</th>
                        <th>Amount</th>
                    </tr>
                    <tr>
                        <td>1000</td>
                        <td><s:textfield type="text" id="1000pcs" value="%{#request['denomination'].thousand}"/></td>
                        <td><s:textfield type="text" id="1000amt" value="0" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                    <tr>
                        <td>500</td>
                        <td><s:textfield type="text" id="500pcs" value="%{#request['denomination'].fivehundred}"/></td>
                        <td><s:textfield type="text" id="500amt" value="0" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                    <tr>
                        <td>200</td>
                        <td><s:textfield type="text" id="200pcs" value="%{#request['denomination'].twohundred}"/></td>
                        <td><s:textfield type="text" id="200amt" value="0" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                    <tr>
                        <td>100</td>
                        <td><s:textfield type="text" id="100pcs" value="%{#request['denomination'].onehundred}"/></td>
                        <td><s:textfield type="text" id="100amt" value="0" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                    <tr>
                        <td>50</td>
                        <td><s:textfield type="text" id="50pcs" value="%{#request['denomination'].fifty}"/></td>
                        <td><s:textfield type="text" id="50amt" value="0" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                    <tr>
                        <td>20</td>
                        <td><s:textfield type="text" id="20pcs" value="%{#request['denomination'].twenty}"/></td>
                        <td><s:textfield type="text" id="20amt" value="0" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                    <tr>
                        <td>10</td>
                        <td><s:textfield type="text" id="10pcs" value="%{#request['denomination'].ten}"/></td>
                        <td><s:textfield type="text" id="10amt" value="0" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                    <tr>
                        <td>5</td>
                        <td><s:textfield type="text" id="5pcs" value="%{#request['denomination'].five}"/></td>
                        <td><s:textfield type="text" id="5amt" value="0" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                    <tr>
                        <td>1</td>
                        <td><s:textfield type="text" id="1pcs" value="%{#request['denomination'].one}"/></td>
                        <td><s:textfield type="text" id="1amt" value="0" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                    <tr>
                        <td>Total</td>
                        <td>&nbsp;</td>
                        <td><input type="text" id="totaldenomination" readonly="true" style="background-color: #ddd"/></td>
                    </tr>
                </table>
            </s:if>
        </s:div>
    </s:form>
    <s:div id="btmbutton" cssStyle="position:fixed;width:600px;margin-left:30em;">


        <s:form id="getseq" action="get-seq" cssStyle="clear:left" theme="simple">
            <script type="text/javascript">
                $(document).ready(function(){
                    $('#prev').click(function(e){
                        var sequence = $('#sequence').val();
                        if(sequence==''){
                            alert('Sequence Number is not specified');
                            document.getElementById('getseq').submit= false;
                        }else{
                            $('#sampleseqp').val(parseInt(sequence)-1);
                            document.getElementById('getseq').submit();
                        }
                    });
                                            
                    $('#nxtseq').click(function(e){
                        var sequence = $('#sequence').val();
                        if(sequence==''){
                            alert('Sequence Number is not specified');
                            document.getElementById('getseq').submit= false;
                        }else{
                            $('#sampleseqp').val(parseInt(sequence)+1);
                            document.getElementById('getseq').submit();
                        }
                    });
                                            
                });

            </script>
            <s:textfield name="sampleseq" id="sampleseqp" cssClass="sampleseq" cssStyle="display:none;" />
            <sj:submit id="prev" button="true" cssClass="ui-state-default" cssStyle="clear:left;float:right;font-size:14px;" value="Previous"/>
            <sj:submit id="nxtseq" button="true" cssClass="ui-state-default" cssStyle="float:right;font-size:14px;" value="Next"/>
        </s:form>
        <sj:a id="searchbtn" button="true" cssClass="ui-state-default" cssStyle="float:right;font-size:14px;margin-top:2px" value="Search">Search</sj:a>
        <%--<s:form theme="simple">
            <sj:submit button="true" cssClass="ui-state-default" cssStyle="float:right;font-size:14px;" value="Search"/>
        </s:form>--%>
        <s:form name="newcollect" action="new-coll" theme="simple">
            <sj:submit id="createnew" button="true" cssClass="ui-state-default" cssStyle="float:right;font-size:14px;" value="Create New"/>
        </s:form>
        <sj:a button="true" value="Post Collection" id="postcollbtn" cssClass="ui-state-default" cssStyle="font-size:14px;float:right;margin-top:2px">Post</sj:a>
        <sj:a cssClass="ui-state-default"
              button="true"
              cssStyle="float:right;margin-top:2px;font-size:14px"
              value="Save Collection"
              id="savebtn"
              >Save</sj:a>

        <s:if test="%{#view!='yes'}">
            <s:div cssStyle="margin-top:2px;margin-left:62px">
                <sj:a button="true" cssClass="ui-state-default" id="viewcollection" cssStyle="font-size:14px">View</sj:a>
            </s:div>
        </s:if>
        <s:else>
            <s:div cssStyle="float:right;margin-top:2px;margin-left:2px;">
                <sj:a button="true" value="View All" id="viewall" cssClass="ui-state-default" cssStyle="font-size:14px">View</sj:a>
            </s:div>
        </s:else>

    </s:div>

</s:div>